<template>
<div>
    <h2 style="text-align: center;">投资管理</h2>
    项目名称: <input type="text" placeholder="请输入项目名称" v-model="Whereinfo.Iname">
    项目总金额： <input type="text" placeholder="请输入最小投资金额" v-model="Whereinfo.MinIbudget">-<input type="text" placeholder="请输入最大投资金额" v-model="Whereinfo.MaxIbudget">
    <input type="button" value="查询" class="btn btn-success"  @click="loadShow">
    <table class="table table-bordered">
        <thead>
            <tr style="background-color: aqua;">
                <td>投资项目编号</td>
                <td>投资项目名称</td>
                <td>投资项目总金额</td>
                <td>已投资金额</td>
                <td>剩余投资金额</td>
                <td>投资次数</td>
                <td>操作</td>
            </tr>
        </thead>

        <tbody>
            <tr v-for="item in info">
                <td>{{ item.I_Id }}</td>
                <td>{{ item.I_Name }}</td>
                <td>{{ item.I_Budget }}</td>
                <td>{{ item.I_Receive }}</td>
                <td>{{ item.I_Residue }}</td>
                <td>{{ item.I_Number }}</td>
                <td>
                    <a href="#" @click="InvestRedeem(item.UI_Id)">赎回</a>
                </td>
            </tr>
        </tbody>
    </table>
</div>
</template>
    
<script setup lang="ts">
import axios from 'axios';
import {onMounted,ref} from 'vue';
import { useUserStore } from '../../store/index.ts';
import router from '../../router/index.ts';

const useStore=useUserStore();
    
    
//创建响应式数据
const info=ref([{
    UI_Id:0,
    U_Id:0,
    I_Id:0,
    I_Name:"",
    I_Budget:0,
    I_Receive:0,
    I_Residue:0,
    I_Number:0
}])
    
//创建响应式数据(用于查询)
const Whereinfo=ref({
    Iname:"",
    MinIbudget:"",
    MaxIbudget:"",
})

//创建生命周期函数钩
onMounted(()=>{
    loadShow()
})

//加载数据方法
const loadShow=()=>{
    axios.get("https://localhost:44321/api/Invest/GetUserInvestUid",
        {
            params:{
                Uid:useStore.Uid
            }
        }
    )
    .then(res=>{
        console.log(res.data)
        info.value=res.data
    })
    .catch(error=>{
        console.log(error);
    })
}

//完成赎回跳转
const InvestRedeem=(UIid:number)=>{
    router.push({
        name:"AddUserInvestRedeem",
        params:{
            UIid:UIid
        }
    })
}
</script>